<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Bootstrap 实例 - 媒体对象列表</title>
<link rel="stylesheet" href="bootstrap/3.3.7/css/bootstrap.min.css">
<script src="jquery/2.1.1/jquery.min.js"></script>
<script src="bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>

	<ul class="media-list">
		<li class="media"><a class="pull-left" href="#"> <img
				class="media-object" src="/wp-content/uploads/2014/06/64.jpg"
				alt="通用的占位符图像">
		</a>
			<div class="media-body">
				<h4 class="media-heading">媒体标题</h4>
				<p>这是一些示例文本。这是一些示例文本。 这是一些示例文本。这是一些示例文本。 这是一些示例文本。这是一些示例文本。
					这是一些示例文本。这是一些示例文本。 这是一些示例文本。这是一些示例文本。</p>
				<!-- 嵌套的媒体对象 -->
				<div class="media">
					<a class="pull-left" href="#"> <img class="media-object"
						src="/wp-content/uploads/2014/06/64.jpg" alt="通用的占位符图像">
					</a>
					<div class="media-body">
						<h4 class="media-heading">嵌套的媒体标题</h4>
						这是一些示例文本。这是一些示例文本。 这是一些示例文本。这是一些示例文本。 这是一些示例文本。这是一些示例文本。
						这是一些示例文本。这是一些示例文本。 这是一些示例文本。这是一些示例文本。
						<!-- 嵌套的媒体对象 -->
						<div class="media">
							<a class="pull-left" href="#"> <img class="media-object"
								src="/wp-content/uploads/2014/06/64.jpg" alt="通用的占位符图像">
							</a>
							<div class="media-body">
								<h4 class="media-heading">嵌套的媒体标题</h4>
								这是一些示例文本。这是一些示例文本。 这是一些示例文本。这是一些示例文本。 这是一些示例文本。这是一些示例文本。
								这是一些示例文本。这是一些示例文本。 这是一些示例文本。这是一些示例文本。
							</div>
						</div>
					</div>
				</div>
				<!-- 嵌套的媒体对象 -->
				<div class="media">
					<a class="pull-left" href="#"> <img class="media-object"
						src="/wp-content/uploads/2014/06/64.jpg" alt="通用的占位符图像">
					</a>
					<div class="media-body">
						<h4 class="media-heading">嵌套的媒体标题</h4>
						这是一些示例文本。这是一些示例文本。 这是一些示例文本。这是一些示例文本。 这是一些示例文本。这是一些示例文本。
						这是一些示例文本。这是一些示例文本。 这是一些示例文本。这是一些示例文本。
					</div>
				</div>
			</div></li>
		<li class="media"><a class="pull-right" href="#"> <img
				class="media-object" src="/wp-content/uploads/2014/06/64.jpg"
				alt="通用的占位符图像">
		</a>
			<div class="media-body">
				<h4 class="media-heading">媒体标题</h4>
				这是一些示例文本。这是一些示例文本。 这是一些示例文本。这是一些示例文本。 这是一些示例文本。这是一些示例文本。
				这是一些示例文本。这是一些示例文本。 这是一些示例文本。这是一些示例文本。
			</div></li>
	</ul>

</body>
</html>